{include file="public/header"}
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, initial-scale=1.0, width=device-width" />
    <meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
    <title>商家中心>充值</title>
    <link rel="stylesheet" type="text/css" href="__CSS__/tt.css" />
    <link href="/static/admin/css/font-awesome.min.css?v=4.7.0" rel="stylesheet">
    <link href="__JSS__/plugins/layui/css/layui.css" rel="stylesheet">
    <style>
        html,
        body {
            width: 100%;
            background: rgba(238, 238, 238, 1);
            margin:0;
            padding:0;
            word-wrap: break-word;
            word-break: break-all;
        }
        .container{
            padding-top:30px;
            padding-bottom:94px;
        }
        .box{
            width:1200px;
            height:786px;
            margin:0 auto;
            padding-top:50px;
            background:#fff;
            border-radius:3px;
            box-sizing:border-box;
        }
        .title{
            margin-left:128px;
            display: flex;
            align-items: center;
            margin-bottom:10px;
        }
        .leftItem{
            font-size:14px;
            color:#333;
            font-weight:500;
            margin-right:30px;
        }
        .inputt{
            width:520px;
            height:34px;
            border:1px solid #ccc;
            border-radius:3px;
            padding-left:10px;
            color:#333;
            font-size:12px;
            box-sizing: border-box;
            outline:none;
        }
        .inputt::-webkit-input-placeholder{
            font-size:12px;
            color:#ccc;
        }
        .tips,.btn,.contact,.content{
            margin-left:214px;
        }
        .tips{
            font-size:12px;
            color:#999;
            margin-bottom:40px;
        }
        .btn{
            width:200px;
            height:34px;
            line-height:34px;
            text-align:center;
            background:#0065F0;
            border-radius:3px;
            color:#fff;
            font-size:12px;
            margin-bottom:40px;
        }
        .contact{
            font-size:14px;
            color:#999;
            font-weight:500;
            margin-bottom:10px;
        }
        .content{
            font-size:14px;
            color:#999;
            margin-bottom:10px;
        }
        .item4_middle {
            -webkit-box-flex: 1;
            -webkit-flex: 1;
            flex: 1;
            position: relative;
            display: -webkit-box;
            display: box;
            display: -webkit-flex;
            display: flex;
            margin-left:220px;
        }
        .lable {
            width: 110px;
        }

        .lable .span1 {
            display: inline-block;
            width: 14px;
            height: 14px;
            vertical-align: middle;
            margin-right: 11px;
            border: 1px solid #D9D9D9;
            border-radius: 50%;
        }

        .lable .span2 {
            display: inline-block;
            width: 14px;
            height: 14px;
            vertical-align: middle;
            margin-right: 11px;
            border: 1px solid #0065F0;
            border-radius: 50%;
            background-size: 100% 100%;
            background: url(__IMG__/yuanhuan1.png) no-repeat center center;
        }

        .radioched {
            display: inline-block;
            width: 14px;
            height: 14px;
            vertical-align: middle;
            margin-right: 11px;
        }

        .span2 img {
            width: 14px;
            height: 14px;
        }

        .hidden {
            display: none !important;
        }

    </style>
</head>

<body>
<header class="wrap3">
    <div class="tt_top3">
        <div class="tt_top33">商家中心 > 充值</div>
    </div>
</header>
<div class="container">
    <div class="box">
        <div class="title">
            <div class="leftItem">充值金额</div>
            <input type="text" class="inputt" id="num" placeholder="请输入充值金额" oninput="value=value.replace(/[^\d.]/g,'')">
        </div>
        <div class="tips">注：最低充值100</div>
        <div class="item4_middle">
            <div class="lable typeclass" onclick="choosetype(0)">
                <label>
                    <span class="span1 hidden"></span>
                    <img src="__IMG__/radio.png" class="radioched"> 支付宝
                </label>
            </div>
            <div class="lable typeclass" onclick="choosetype(1)">
                <label>
                    <img src="__IMG__/radio.png" class="radioched hidden">
                    <span class="span1"></span> 微信
                </label>
            </div>
        </div>
        <br/>
        <br/>
        <br/>
        <div class="title hidden wxerweima">
            <div class="leftItem">二维码</div>
            <div id="wxerweima">
            </div>
        </div>
        <div class="btn" id="btn" style="cursor:pointer;margin-top: 20px">立即充值</div>
        <div class="contact">{$explain}</div>
    </div>
</div>
</body>
{include file="public/footer"}
<script type="text/javascript" src="__JS__/api.js"></script>
<script type="text/javascript" src="__JSS__/plugins/layui/layui.all.js"></script>
<script type="text/javascript">
    var type = 1;
    //选择方式
    function choosetype(index) {
        var span1 = document.getElementsByClassName('span1');
        var radioched = document.getElementsByClassName('radioched');
        type = index+1;
        for (var i = 0; i < span1.length; i++) {
            span1[i].className = 'span1';
            radioched[i].className = 'radioched hidden';
        }
        span1[index].className = 'span1 hidden';
        radioched[index].className = 'radioched';
        $('#task_share_type').val(index+1);
        if(index == 0){
            $('.wxerweima').addClass('hidden');
        }
    }
    //支付
    $('#btn').click(function () {
        var num = $('#num').val();
        if(num < 100){
            layer.msg('最低充值100元', {time:1500, icon:2, offset: '300px'});
        }else {
            if(type == 1){
                window.location.href = '/shop/Center/alipay?money=' + num;
            }else {
                $.ajax({
                    url: '/shop/Center/wxPay',
                    data: 'money='+num,
                    type: 'POST',
                    dataType: 'JSON',
                    success: function (returnData) {
                        $('.wxerweima').removeClass('hidden');
                        $('#wxerweima').html(returnData.msg);
                        settime(returnData.oid);
                    },
                    error: function () {
                        alert('数据出错，请刷新重试');
                    }
                })
//                window.location.href = '/shop/Center/wxPay?money=' + num;
            }
        }
    });
    function settime(oid) {
        $.ajax({
            url: '/shop/Callback/getWxStatus',
            data: 'oid='+oid,
            type: 'POST',
            dataType: 'JSON',
            success: function (returnData) {
                if(returnData.status == 200){
                    location.href = '/shop/Center/centerPage';
                    return;
                }else{
                    setTimeout(function() {
                        settime(returnData.oid)
                    },1000)
                }
            },
            error: function () {
                alert('数据出错，请刷新重试');
            }
        });
    }
</script>

</html>
